<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/pay.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">订单确认</h1>
		</header>
		<div class="mui-content">
			<!-- 收货地址选择div -->
			<div class="mui-row">
				<div class="mui-card">
					<label>请添加你的收货地址：</label><br>
					<div id="shippingAddress"></div>
<!-- 					<button class="mui-btn mui-icon mui-icon-arrowright mui-pull-right" type="button" style="margin: 12px;" id="shippingaddress"></button>
 -->					<button class="mui-btn mui-btn-numbox-plus mui-pull-right" type="button" style="margin: 12px;" id="add-shippingaddress">+</button>
				</div>
				
			</div>
			<!-- 收货地址选择div end -->
			<!-- 订单详细页面 -->
			<div class="mui-card" id="product-cart-info">
				<div>
					这里是商品详细信息
				</div>
			</div>
			<!-- 订单详细页面 end-->
			<!-- 选择支付方式 -->
			<div class="mui-content rf-pay-content">
			    支付金额：
			    <input id="jine" type="number" value="0.01" /> 元
			    <div class="top oauth-area" id="testLogin">
					<button type="button" id="wxpay" class=" pay mui-btn mui-btn-success">微信支付</button>
					<button type="button" id="alipay" class=" pay mui-btn mui-btn-primary">支付宝支付</button>
			    </div>
			</div>
			<ul class="mui-table-view">
			    <li class="mui-table-view-cell"> 支付方式: <span id="channel"></span> </li>
			    <li class="mui-table-view-cell"> 订单号: <span id="bill_no"></span> </li>
			    <li class="mui-table-view-cell"> 支付金额: <span id="total_fee"></span> </li>
			    <li class="mui-table-view-cell"> 支付状态:<span id="status"></span> </li>
			    <textarea name="" id="status_msg" cols="20" rows="5"></textarea>
			</ul>
			<!-- 选择支付方式 end-->
			<!-- 合计  提交订单 -->
			<!-- 合计  提交订单  end-->
		</div>
		<script src="js/mui.js"></script>
		<script src="js/app.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function(){
				userbean =  app.getUserGlobalInfo();
				checkShippingAddress();
			});
			document.getElementById("add-shippingaddress").addEventListener('tap',function(){
				console.log('点击了添加收货地址事件');
			});
			function checkShippingAddress(){
				if(userbean=="" || userbean==null){
				    mui.toast("请您登录后重试");
					return;
				}
				mui.ajax(app.serverUrl+"/shipping/list.action", {
							type:'POST',
							async:  false, // 同步
							dataType: 'json', //服务器返回json格式数据
							timeout: 15000, //15秒超时
							success: function(obj) {
								console.log("执行 了success 方法=====order-create.html ");
								console.log('服务器返回数据obj=========='+JSON.stringify(obj));
								if(obj.code == 0 || obj.code == "0" ){
									var shippinglist = obj.data.list;
									console.log("shippinglist=length====="+shippinglist.length);
									if(shippinglist.length > 0){
										updateShippingAddress(shippinglist);
									}
								}else{
									mui.toast('查询收货地址数据失败');
								}
							},
							error: function(xhr, type, errorThrown) {
								mui.toast('系统错误');
								console.log(type);
								console.log(errorThrown);
							}
						});
				}
			//更新地址
			function updateShippingAddress(shippinglist) {
				var str='';
				str+='收货人姓名：'+shippinglist[0].receiverName+'\n';
				str+='收货人电话：'+shippinglist[0].receiverPhone+'\n';
				str+='收货人详细地址--省份：'+shippinglist[0].receiverProvince+
											'城市：'+shippinglist[0].receiverCity+
											'区域：'+shippinglist[0].receiverDistrict+
											'具体地址'+shippinglist[0].receiverAddress;
				$('#shippingAddress').append(str);
				//修改添加图标
				$('#add-shippingaddress').empty().removeClass('mui-btn-numbox-plus').addClass('mui-icon mui-icon-arrowright');
			}	
			//添加newId自定义事件监听
			window.addEventListener('updateProductList',function(event){
			  //获得事件参数
			  console.log('执行到了updateProductList方法===');
			  var data = event.detail.data;
			  console.log('data======='+data[0].price);
			  console.log('data======='+data[0].quantity);
			  console.log('data======='+data[0].total);
			  console.log('data======='+data[0].productId);
			  $('#product-cart-info div').append('商品单价==='+data[0].price+'商品数量==='+data[0].quantity+'商品总价==='+data[0].total+'商品名称==='+data[0].productId);
			  // console.log($('#product-cart-info').html());
			  $('#jine').val(data[0].total);
			});
		</script>
	</body>

</html>
